<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .input{position: relative;}
        .input input{position: absolute;left:0;top:0;z-index: 1;background: transparent;}
        .input span{position: absolute;left:4px;top:0;font-size:13px;color: #666;}
    </style>
</head>
<body>
    <input type="text" placeholder="默认提示">

    <div class="input">
        <input type="text">
        <span>默认提示</span>
    </div>
</body>
<script>
    var ipt = document.querySelector(".input input");
    var span = document.querySelector(".input span");
    // 绑定输入框的输入事件
    ipt.oninput = function(){
        // 判断输入框内容是否为空
        if(this.value === ""){
            // 为空，显示提示
            span.style.display = "block";
        }else{
            // 不为空，隐藏提示
            span.style.display = "none";
        }
    }
    
</script>
</html>